import { cookie } from "./tool.js";

class Header{
    constructor(){
        // 获取购物车按钮
        this.carbut = $(".mycar");
        // 获取登录注册的模块
        this.login_user = $(".login_riget");
    }
    init(){
        let obj ={};
        let cookielist={};
        if(cookie.get("cookieUsername")){
            obj = JSON.parse(cookie.get("cookieUsername"));
        }else{
            if(location.href=="http://localhost:3000/cartlist.html"){
                location.href="http://localhost:3000/login.html"
            }
        }
        this.carbut.on("click",function(){
            if(obj.usernam){
                location.href="http://localhost:3000/cartlist.html"
            }else if( confirm("您还未登录！是否前往登录！！！")){
                location.href="http://localhost:3000/login.html"
            }
        })

        if(obj.usernam){
            $(".username").addClass("active");
            $(".username span i" ).html(obj.usernam);
            $(".back").on("click",function(){
                if(confirm("确认是否退出！！！")){
                    cookie.remove("cookieUsername");
                    location.href="http://localhost:3000/login.html";
                }
            })
        }else{
            $(".login_reg").addClass("active");
        }


        // 给购物车按钮添加事件
        function car_but_check(){
            if(cookie.get(obj.usernam+"list")){
            cookielist = JSON.parse(cookie.get(obj.usernam+"list"));
            }
            let index =0;
            $.each(cookielist,function(i,v){
                index++;
            })
            console.log(index)
            $(".mycar i").html(index)
        }
        car_but_check()
        
        // 三级列表
        // 一级列表的a标签
        let yiji_but = $(".yiji>li>a");
        yiji_but.on("mouseover",function(){
            $(".erji").css("height","850px")
            $(".erji_list").eq($(this).parent().index()).addClass("active").siblings().removeClass("active")
        })
        
        $(".erji").on("mouseover",function(){
            $(".erji").css("height","850px")
        })
        $(".erji").on("mouseout",function(){
            $(".erji").css("height","0")
        })

        $(".list_bottom_left>ul>li>a").on("mouseover",function(){
           console.log($(this).parent().index()) 
            $(this).parents(".erji_list_bottom").find(".list_bottom_center .center_list").eq($(this).parent().index()).addClass("action").siblings().removeClass("action")
        })

        $(".icon-guanbi").on("click",function(){
            $(".erji").css("height","0")
            
         })
        //  头部搜索提示框jsonp
        $("#seach_inp").on("input",function(){
            fetch(`http://localhost:3000/list/header?val=${$("#seach_inp").val()}`,{
                method:"get",
            }).then((res) => {
                return res.text();
            })
            .then((data) => {
                let str = JSON.parse(data).keywordsStr;
                let arr = str.split(",")
                let newstr = "";
                console.log(arr)
                $.each(arr, function (index, value) {
                    console.log(index,value)
                    newstr += `<a href="javascript:;" class="zhi">${value}</a>`;
                });
                $(".inset_ul").html(newstr);
                $(".zhi").on("click", function () {
                    $("#seach_inp").val($(this).html());
                    $(".inset_ul").css("display", "none");
                });
            });
        })
        
        $("#seach_inp").on("blur",function(){
            $(".inset_ul").css("opacity","0")
        })
        $("#seach_inp").on("focus",function(){
            $(".inset_ul").css("opacity","1")
            $(".inset_ul").css("display","flex")
        })
    }
    
}
export{
    Header
}